<script>
import { ref } from "vue";
export default {
  setup() {
    const onClickLeft = () => history.back();
    const active = ref(0);

    return {
      onClickLeft,
      active,
    };
  },
};
</script>

<template>
  <div>
    <div class="shouye">首页</div>
    <van-grid :column-num="3">
      <van-grid-item icon="photo-o" text="打卡" />
      <van-grid-item icon="photo-o" text="工作路线" />
      <van-grid-item icon="photo-o" text="工作汇报" />
      <van-grid-item icon="photo-o" text="指令" />
      <van-grid-item icon="photo-o" text="拍照上传" />
      <van-grid-item icon="photo-o" text="请假" />
      <van-grid-item icon="photo-o" text="出差" />
      <van-grid-item icon="photo-o" text="报销" />
      <van-grid-item icon="photo-o" text="调休" />
    </van-grid>
    <!-- 底部 -->
    <van-tabbar v-model="active">
      <van-tabbar-item to="/Index" icon="home-o">首页</van-tabbar-item>
      <van-tabbar-item to="/Management" icon="search">管理</van-tabbar-item>
      <van-tabbar-item to="/TheMessage" icon="friends-o">消息</van-tabbar-item>
      <van-tabbar-item to="/My" icon="setting-o">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>
<style scoped lang="scss">
.shouye {
  width: 100%;
  height: 2.5rem;
  background-color: rgb(5, 115, 226);
  color: white;
  line-height: 2.5rem;
  text-align: center;
}
</style>
